<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <title>动态REM</title>
    <script type="text/javascript">
        //引入该flexible.min.js
        !function (e, t) { function n() { var n = l.getBoundingClientRect().width; t = t || 540, n > t && (n = t); var i = 100 * n / e; r.innerHTML = "html{font-size:" + i + "px;}" } var i, d = document, o = window, l = d.documentElement, r = document.createElement("style"); if (l.firstElementChild) l.firstElementChild.appendChild(r); else { var a = d.createElement("div"); a.appendChild(r), d.write(a.innerHTML), a = null } n(), o.addEventListener("resize", function () { clearTimeout(i), i = setTimeout(n, 300) }, !1), o.addEventListener("pageshow", function (e) { e.persisted && (clearTimeout(i), i = setTimeout(n, 300)) }, !1), "complete" === d.readyState ? d.body.style.fontSize = "16px" : d.addEventListener("DOMContentLoaded", function (e) { d.body.style.fontSize = "16px" }, !1) }(750, 750);
    </script>
    <style>
        body,dl,dd,ul,ol,h1,h2,h3,h4,h5,h6,pre,form,input,textarea,p,hr,thead,tbody,tfoot,th,td{margin:0;padding:0;}
        ul,ol{list-style:none;}
        a{text-decoration:none;}
        html{-ms-text-size-adjust:none;-webkit-text-size-adjust:none;text-size-adjust:none;}
        body{line-height:1.5; font-size:14px;}
        body,button,input,select,textarea{font-family:'helvetica neue',tahoma,'hiragino sans gb',stheiti,'wenquanyi micro hei',\5FAE\8F6F\96C5\9ED1,\5B8B\4F53,sans-serif;}
        b,strong{font-weight:bold;}
        i,em{font-style:normal;}
        table{border-collapse:collapse;border-spacing:0;}
        table th,table td{border:1px solid #ddd;padding:5px;}
        table th{font-weight:inherit;border-bottom-width:2px;border-bottom-color:#ccc;}
        img{border:0 none;width:auto\9;max-width:100%;vertical-align:top; height:auto;}
        button,input,select,textarea{font-family:inherit;font-size:100%;margin:0;vertical-align:baseline;}
        button,html input[type="button"],input[type="reset"],input[type="submit"]{-webkit-appearance:button;cursor:pointer;}
        button[disabled],input[disabled]{cursor:default;}
        input[type="checkbox"],input[type="radio"]{box-sizing:border-box;padding:0;}
        input[type="search"]{-webkit-appearance:textfield;-moz-box-sizing:content-box;-webkit-box-sizing:content-box;box-sizing:content-box;}
        input[type="search"]::-webkit-search-decoration{-webkit-appearance:none;}
        input:focus{outline:none;}
        select[size],select[multiple],select[size][multiple]{border:1px solid #AAA;padding:0;}
        article,aside,details,figcaption,figure,footer,header,hgroup,main,nav,section,summary{display:block;}
        audio,canvas,video,progress{display:inline-block;}
        body{background:#fff;}
        input::-webkit-input-speech-button {display: none}
        button,input,textarea{
        -webkit-tap-highlight-color: rgba(0,0,0,0);
        }
    </style>
</head>

<body>
    <div style="width:10rem;height:2rem;background:#f00;color:#fff;text-align:center;">
        test
    </div>
</body>

</html>